import React from 'react';
import AxCard from '@/components/AxBase/AxCard';
import { axconst } from '@/shared/axconst';
import './style.css';
import AxPageHeaderWrapper from '@/components/AxBase/AxPageHeaderWrapper';
import AxOperationButton from '@/components/AxList/AxOperationButton';
import { AxTable } from '@/components/AxList';
import AxColumnAction from '@/components/AxList/AxColumnAction';

const InstructorCenter: React.FC<any> = props => {
  /** 配置列 */
  const columns = [
    {
      title: '序号',
      dataIndex: 'orgName1',
      width: axconst.width.two,
    },
    {
      title: '项目经费类型',
      dataIndex: 'orgName2',
      width: axconst.width.longx,
    },
    {
      title: '项目经费名称',
      dataIndex: 'orgName3',
      width: axconst.width.six,
    },
    {
      title: '项目经费编码',
      dataIndex: 'orgName4',
      width: axconst.width.fouronly,
    },
    {
      title: '申请项目经费',
      dataIndex: 'orgName5',
      width: axconst.width.fouronly,
    },
    {
      title: '项目经费本编号',
      dataIndex: 'orgName6',
      width: axconst.width.five,
    },
    {
      title: '项目经费说明',
      dataIndex: 'orgName',
      width: axconst.width.five,
    },
    {
      title: '申请时间',
      dataIndex: 'orgName7',
      width: axconst.width.fouronly,
    },
    {
      title: '申请状态',
      dataIndex: 'orgName8',
      width: axconst.width.fouronly,
      // render: (val: any, record: any) => (
      //     <AxColumnAction
      //         buttons={[
      //             {
      //                 text: '查看',
      //                 // onClick: () => this.handleDetailValues(true, record),
      //             },
      //         ]}
      //     />
      // ),
    },
  ];

  const data = {
    list: [
      {
        orgName1: '1',
        orgName2: '甘油',
        orgName3: '7681-52-9',
        orgName4: '固体',
        orgName5: 'g',
        orgName6: '1000000',
        orgName7: '1',
        orgName8: '通过审核',
        orgName9: '1',
      },
    ],
  };

  /** 配置操作按钮 */
  const buttons = [
    {
      text: '刷新',
      icon: 'redo',
      type: 'primary',
      //   onClick: this.axHandleRefresh,
    },
  ];

  const operationProps = {
    buttons: buttons,
    //   searchOption: this.searchOption,
    advanceSearch: false,
    //   handleVisible: this.axHandleSearchVisible,
    //   handleSearch: this.axHandleSearch,
  };

  return (
    <AxPageHeaderWrapper
      style={{ height: 48 }}
      title={<span style={{ fontSize: 14, fontWeight: 'normal' }}>申请记录</span>}
    >
      <AxCard>
        <AxOperationButton {...operationProps} />
        <AxTable
          resizable
          columns={columns}
          checkboxFixed={false}
          addemptycolumn={true}
          data={data}
        />
      </AxCard>
    </AxPageHeaderWrapper>
  );
};

export default InstructorCenter;
